<template>
    <div class="app-container calendar-list-container">
        <search :list="queryList" :queryEntity="queryEntity"></search>
        <buttons :showQuery="true" :showBack="false" @query="doQuery" :list="btnList" :disabled="disabled"
            placeholder="订单号" :permissions="permissions"></buttons>
        <grid gridTitle="收款单" :url="url" :columns="columns" :enableEdit="false" :loading="true" ref="mainGrid"
            height="auto" diffHeight="135" :pagination="true" :permissions="permissions" :multi="false"
            @change="rowCilck" :queryEntity="queryEntity" @view="doView" @pass="doPass" @cancel="doCancel"
            @finish="doFinish" @adjust="doAdjust" @pay="doPay" @settlement="doSettlement" @settle="doSettle"
            @cancelSettle="doCancelSettle" @cancelSettlement="doCancelSettlement">
        </grid>
    </div>
</template>
<script>
    import request from '@/router/axios'
    import { Message, MessageBox } from 'element-ui'
    import url from '@/const/apiURL'
    import grid from '@/components/Grid'
    import buttons from '@/components/Buttons'
    import { mapGetters } from 'vuex'
    import { BillStatusFormatter, BusinessTypeFormatter, YesOrNoFormatter, BillSourceFormatter } from '@/const/dict'
    import search from '@/components/Search'
    import { colunms } from '@/const/colunms'
    import { dict } from '@/const/dict'
    import { queryField } from '@/const/query'
    import { bgColor } from '@/const/bgColor'

    export default {
        components: { grid, buttons, search },
        data() {
            return {
                orderNo: '',
                url: url.FINA_BILL_LIST_URL,
                entity: {},
                queryEntity: { billType: 'IN', includeStatus: ["UN_CHECK", "PASS", "FINISH", "SETTLEMENT", "CLEAN"] },
                disabled: true,
                columns: [
                    {
                        label: '操作', width: 180, prop: 'op', align: 'center', template: 'op', opList: [
                            { name: '查看', clickName: 'view', auth: 'bill_in_view' },
                            { name: '通过', clickName: 'pass', auth: 'bill_in_pass', confirm: true, valueProp: "orderStatus", showValue: ["UN_CHECK"] },
                            { name: '取消', clickName: 'cancel', auth: 'bill_in_cancel', confirm: true, valueProp: "orderStatus", showValue: ["UN_CHECK", "PASS"] },
                            { name: '确认', clickName: 'finish', auth: 'bill_in_finish', confirm: true, valueProp: "orderStatus", showValue: ["PASS"] },
                            { name: '调整单', clickName: 'adjust', auth: 'bill_in_adjust', valueProp: "orderStatus", showValue: ["PASS", "FINISH"] },
                            { name: '收款记录', clickName: 'pay', auth: 'bill_in_pay', valueProp: "orderStatus", showValue: ["FINISH"] },
                            { name: '完成', clickName: 'settlement', auth: 'bill_in_settlement', confirm: true, valueProp: "orderStatus", showValue: ["FINISH"] },
                            { name: '结清', clickName: 'settle', auth: 'bill_in_settle', confirm: true, valueProp: "orderStatus", showValue: ["FINISH"], btnColor: 'red' },
                            { name: '取消结清', clickName: 'cancelSettle', auth: 'bill_in_settle', confirm: true, valueProp: "orderStatus", showValue: ["CLEAN"] },
                            { name: '取消完成', clickName: 'cancelSettlement', auth: 'bill_in_settle', confirm: true, valueProp: "orderStatus", showValue: ["SETTLEMENT"] }
                        ]
                    },
                    { label: '对账单号', width: 180, prop: 'billNo', align: 'left' },
                    { label: '客户名称', width: 200, prop: 'customerName', align: 'left' },
                    { label: '对账来源', width: 80, prop: 'billSource', align: 'center', formatter: BillSourceFormatter, template: 'bgColor', bgColor: bgColor().BillSource },
                    { label: '币种', width: 80, prop: 'currency', align: 'center' },
                    { label: '总金额', width: 100, prop: 'totalAmount', align: 'center' },
                    { label: '扣款', width: 80, prop: 'deductionAmount', align: 'center' },
                    { label: '调整金额', width: 80, prop: 'adjustAmount', align: 'center' },
                    { label: '应收金额', width: 100, prop: 'amount', align: 'center' },
                    { label: '已收金额', width: 100, prop: 'payAmount', align: 'center' },
                    { label: '剩余金额', width: 100, prop: '', align: 'center', formatter: function (row) { return (row.amount - row.payAmount - row.surplusAmount).toFixed(2) } },
                    { label: '结余金额', width: 100, prop: 'surplusAmount', align: 'center' },
                    { label: '订单状态', width: 80, prop: 'orderStatus', align: 'center', formatter: BillStatusFormatter, template: 'bgColor', bgColor: bgColor().BillStatus },
                    { label: '对账开始', width: 100, prop: 'checkStartDate', align: 'center' },
                    { label: '对账结束', width: 100, prop: 'checkEndDate', align: 'center' },
                    { label: '创建人', width: 100, prop: 'createUserName', align: 'center' },
                    { label: '创建时间', width: 100, prop: 'createTime', align: 'center' }
                ],
                btnList: [
                    // { name: '查看', type: 'primary', icon: 'edit', click: 'view', auth: 'bill_in_view', ctr: true },
                    // { name: '通过', type: 'primary', icon: 'edit', click: 'pass', auth: 'bill_in_pass', ctr: true, confirm: true },
                    //  { name: '取消', type: 'primary', icon: 'edit', click: 'cancel', auth: 'bill_in_cancel', ctr: true, confirm: true },
                    // { name: '完成', type: 'primary', icon: 'edit', click: 'finish', auth: 'bill_in_finish', ctr: true, confirm: true },
                    // { name: '调整单', type: 'primary', icon: 'edit', click: 'adjust', auth: 'bill_in_adjust', ctr: true },
                    // { name: '收款记录', type: 'primary', icon: 'edit', click: 'pay', auth: 'bill_in_pay', ctr: true }
                ],
                queryList: [
                    { name: '对账单号', type: 'text', prop: 'billNo', placeholder: "对账单号" },
                    { name: '创建时间', type: 'date', prop: 'startTime', placeholder: "" },
                    { name: '----', type: 'date', prop: 'endTime', placeholder: "", },
                    { name: '订单状态', type: 'select', prop: 'orderStatus', placeholder: "订单状态", values: dict().BillStatus, label: 'name', value: 'value' },
                    { name: '客户名称', type: 'query', prop: 'customerCode', rowValue: 'customerCode', rowName: 'customerName', url: url.CUSTOMER_LIST_URL, columns: colunms().customerColumns, pagination: true, queryList: queryField().customer, queryEntity: { customerType: 'CUSTOMER' } },
                    // { name: '工序', type: 'query', prop: 'stepCode', rowValue: 'stepCode', rowName: 'stepName', url: url.STEP_LIST_URL, columns: colunms().stepColumns, pagination: true, queryList: queryField().step, queryEntity: { status: 1 } },
                    { name: '对账时间', type: 'date', prop: 'checkStartDate', placeholder: "" },
                    { name: '----', type: 'date', prop: 'checkEndDate', placeholder: "" }
                ]
            }
        },
        created() {
        },
        computed: {
            ...mapGetters(['permissions'])
        },
        methods: {
            doQuery(text) {
                this.$refs['mainGrid'].doQuery(text)
            },
            rowCilck(row) {
                this.disabled = row.length == 0
            },
            doAdjust(row) {
                if (row) {
                    this.$router.push({ path: '/fina/bill/adjust', query: { billNo: row.billNo } })
                }
            },
            doPay(row) {
                if (row) {
                    this.$router.push({ path: '/fina/bill/pay', query: { billNo: row.billNo, customerName: row.customerName, type: 'in' } })
                }
            },
            doCancelSettle(row) {
                if (row) {
                    this.cancelSettleOp(row.billNo).then((data) => {
                        if (data) {
                            this.$refs['mainGrid'].reload()
                        }
                    })
                }
            },
            cancelSettleOp(billNo) {
                return request({
                    url: url.FINA_BILL_CANCEL_SETTLE_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            },
            doCancelSettlement(row) {
                if (row) {
                    this.cancelSettlementOp(row.billNo).then((data) => {
                        if (data) {
                            this.$refs['mainGrid'].reload()
                        }
                    })
                }
            },
            cancelSettlementOp(billNo) {
                return request({
                    url: url.FINA_BILL_CANCEL_SETTLEMENT_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            },
            doCancel(row) {
                if (row) {
                    this.cancelOp(row.billNo).then((data) => {
                        if (data) {
                            this.$refs['mainGrid'].reload()
                        }
                    })
                }
            },
            cancelOp(billNo) {
                return request({
                    url: url.FINA_BILL_CANCEL_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            },
            doFinish(row) {
                if (row) {
                    this.finishOp(row.billNo).then((data) => {
                        if (data) {
                            this.$refs['mainGrid'].reload()
                        }
                    })
                }
            },
            finishOp(billNo) {
                return request({
                    url: url.FINA_BILL_FINISH_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            },
            doPass(row) {
                if (row) {
                    this.passOp(row.billNo).then((data) => {
                        if (data) {
                            this.$refs['mainGrid'].reload()
                        }
                    })
                }
            },
            doSettlement(row) {
                if (row) {
                    this.settlementOp(row.billNo).then((data) => {
                        if (data) {
                            this.$refs['mainGrid'].reload()
                        }
                    })
                }
            },
            doSettle(row) {
                if (row) {
                    this.settleOp(row.billNo).then((data) => {
                        if (data) {
                            this.$refs['mainGrid'].reload()
                        }
                    })
                }
            },
            passOp(billNo) {
                return request({
                    url: url.FINA_BILL_PASS_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            },
            doView(row) {
                if (row) {
                    this.$router.push({ path: '/fina/bill/view', query: { billNo: row.billNo, billSource: row.billSource, billType: 'IN' } })
                }
            },
            settlementOp(billNo) {
                return request({
                    url: url.FINA_BILL_SETTLEMENT_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            },
            settleOp(billNo) {
                return request({
                    url: url.FINA_BILL_SETTLE_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            },
            viewOp(billNo) {
                return request({
                    url: url.FINA_BILL_VIEW_URL,
                    method: 'post',
                    params: { billNo },
                    data: { key: 'key' }
                })
            }
        }
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .w-body {
        padding-top: 8px;
    }

    .w-table {
        border: 1px solid #ebeef5;
    }

    .w-table-title {
        border: 1px solid #ebeef5;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        word-break: break-all;
        line-height: 23px;
        display: inline-block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        position: relative;
        vertical-align: middle;
        width: 100%;
        font-size: 14px;
        color: gray;
    }
</style>